<style>
    .warranty-image-wrapper .warranty-image-list{
        display: flex;
        flex-wrap: wrap;
    }
    .warranty-image-wrapper .warranty-image-list .item{
        width: 100px;
        flex: 0 0 100px;
        height: 100px;
        padding: 0;
        overflow: hidden;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        display: block;
    }
    .warranty-image-wrapper .warranty-image-list .item{
        margin: 10px;
    }
    .warranty-image-wrapper .warranty-image-list .item img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
</style>
<div class="warranty-image-wrapper" id="warrantyImageWrapper">
    <div class="warranty-image-list">
        @foreach($images as $v)
            {{--<div class="item" href="{{ getInstallPicture($v->image_src) }}" style="background-image: url('{{ getInstallPicture($v->image_src) }}')"></div>--}}
            <div class="item">
                <img src="{{ getInstallPicture($v->image_src) }}">
            </div>
        @endforeach
    </div>
</div>